<template>
  <div>
    <van-tabbar
      v-model="active"
      active-color="rgb(34, 169, 255)"
      inactive-color="#000"
    >
      <van-tabbar-item icon="search">外卖</van-tabbar-item>
      <van-tabbar-item icon="search">搜索</van-tabbar-item>
      <van-tabbar-item icon="orders-o">订单</van-tabbar-item>
      <van-tabbar-item icon="user-o">我的</van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script>
export default {
  data() {
    return {
      active: 3,
      //   icon: {
      //     active: "https://img01.yzcdn.cn/vant/user-active.png",
      //     inactive: "https://img01.yzcdn.cn/vant/user-inactive.png",
      //   },
    };
  },
};
</script>

<style lang="less" scoped>
// /deep/.van-tabbar {
//   line-height: 50px;
// }
// /deep/.van-tabbar-item__icon {
//   color: #ccc;
// }
// /deep/.van-icon {
//   color: black;
//   background-color: #ccc;
// }
</style>